<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>人脸抓拍分析数据大屏</title>

    <link rel="stylesheet" type="text/css" th:href="@{/css/data/face/common.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/css/data/face/index.rem.css}"/>

</head>

<body>
<img th:src="@{/images/data/face/SketchPng759d15874e729850d1dbaae00fda2dd9c17be986ad95746c938789aa9e5b5fca.png}" class="bg" />
<!--<video class="videobg" id="video" th:src="@{/images/data/video2.mp4}" style="width: 100%; height:100%;" autoplay="" muted="" loop=""></video>-->
<div class="page flex-col">
    <div class="block_1 flex-col">
        <div class="block_2 flex-col">
            <div class="text-wrapper_1 flex-row">
                <span class="text_1">人脸抓拍分析数据大屏</span>
            </div>
            <div class="text-wrapper_2 flex-row">
                <span class="text_2">00:00:00</span>
                <span class="text_3">2023-01-01</span>
                <span class="text_4">星期一</span>
            </div>
        </div>
        <div class="block_3 flex-col">
            <div class="section_1 flex-row justify-between">
                <div class="box_1 flex-col">
                    <span class="text_5">分包出勤情况</span>
                    <div class="box_2 flex-row" id="echarts_1">

                    </div>
                    <div class="box_3 flex-col">
                        <div class="section_3 flex-col"></div>
                        <div class="section_4 flex-col"></div>
                    </div>
                    <div class="box_4 flex-col justify-end">
                        <div class="text-wrapper_3 flex-row justify-between">
                            <span class="text_7">分包单位</span>
                            <span class="text_8">出勤/总人数</span>
                            <span class="text_9">实时人数</span>
                        </div>
                        <div class="box_5 flex-col"></div>
                    </div>
                    <img class="image_5" referrerpolicy="no-referrer"
                         th:src="@{/images/data/face/SketchPnga885c712871a02f9b0e4fc28cc3e4a9441dae1efec80c9f6b3f7d204a6590ce7.png}"/>
                    <div class="page_list" id="page_list">

                    </div>
                </div>
                <span class="text_25">人脸抓拍基本数据</span>
                <div class="box_6 flex-col">
                    <span class="text_26">班组出勤情况</span>
                    <div class="box_2 flex-row" id="echarts_2">

                    </div>
                    <div class="section_6 flex-col">
                        <div class="block_4 flex-col"></div>
                        <div class="block_5 flex-col"></div>
                    </div>
                    <div class="section_7 flex-col justify-end">
                        <div class="text-wrapper_7 flex-row">
                            <span class="text_28">班组</span>
                            <span class="text_29">出勤/总人数</span>
                            <span class="text_30">实时人数</span>
                        </div>
                        <div class="group_1 flex-col"></div>
                    </div>
                    <img class="image_10" referrerpolicy="no-referrer"
                         th:src="@{/images/data/face/SketchPnga885c712871a02f9b0e4fc28cc3e4a9441dae1efec80c9f6b3f7d204a6590ce7.png}"/>
                    <div class="group_list" id="group_list">

                    </div>
                </div>
            </div>
            <div class="section_8 flex-col">
                <!--<img src="image/cc606dde8b77e527f192d0e714b79000.gif" style="width: 11rem;position: absolute;left: 7.1rem;top: 3.2rem;"/>-->
                <div class="section_9 flex-row justify-between">
                    <div class="group_2 flex-col"></div>
                    <img class="image_11" referrerpolicy="no-referrer"
                         th:src="@{/images/data/face/SketchPng8445ccab77e177901f8d2cbc4f36cc71dda87e89b0c20d31557e9a547910cbc4.png}"/>
                </div>
                <div class="text-wrapper_11 flex-row justify-between">
                    <span class="text_46">0</span>
                    <span class="text_47">0%</span>
                </div>
                <div class="section_10 flex-row justify-between">
                    <div class="section_11 flex-col justify-between">
                        <span class="text_48">总人数</span>
                    </div>
                    <div class="text-group_5 flex-col justify-between">
                        <span class="text_49">0</span>
                        <span class="text_50">实时人数</span>
                    </div>
                    <div class="section_12 flex-col justify-between">
                        <span class="text_51">出勤率</span>
                    </div>
                </div>
                <div class="section_13 flex-row justify-between">
                    <div class="image-text_5 flex-col justify-end">
                        <img class="image_12" referrerpolicy="no-referrer"
                             th:src="@{/images/data/face/SketchPngce2f4e3b8d287bc0ccc23b60aaf7578de98f324f5833ce50c5f4f3dfa9e5a3ec.png}"/>
                        <div class="text-group_6 flex-col justify-between">
                            <span class="text_52">0</span>
                            <span class="text_53">抓拍人次</span>
                        </div>
                    </div>
                    <div class="image-text_6 flex-col justify-end">
                        <div class="box_8 flex-col"></div>
                        <div class="text-group_7 flex-col justify-between">
                            <span class="text_54">0</span>
                            <span class="text_55">出勤人数</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="block_6 flex-row">
					<span class="paragraph_1">
            报
            <br/>
            警
            <br/>
            抓
            <br/>
            拍
          </span>

            <div class="list_1 flex-row" id="record_list">

            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript" th:inline="javascript">
    // 获取项目名称（如：/project-name/）
    /*<![CDATA[*/
    var ctxPath = /*[[@{/}]]*/ '';
</script>
<script type="text/javascript" th:src="@{/js/util/jquery-2.1.1.min.js}"></script>
<script type="text/javascript" th:src="@{/js/echarts/echarts-4.5.0.js}"></script>
<script type="text/javascript" th:src="@{/js/data/face/flexible.js}"></script>
<script type="text/javascript" th:src="@{/js/data/face/data2.js}"></script>
<script type="text/javascript" th:src="@{/js/data/face/echarts1.js}"></script>
<script type="text/javascript" th:src="@{/js/data/face/echarts2.js}"></script>
<script type="text/javascript" th:src="@{/js/data/face/data_socket.js}"></script>


</html>